<template>
<div class="healthy-form">
      <b-row>
        <b-col>
          <b-row class="healthy-row" v-for="item in form" :key="item.id">
            <b-col sm="4">
              <label :for="item.id">{{ item.text }}:</label>
            </b-col>
            <b-col sm="4">
              <b-form-input :id="item.id" :type="number" v-model="item.value"></b-form-input>
            </b-col>
            <b-col class="healthy-col" sm="4">{{ item.reference }}</b-col>
          </b-row>
              <b-button class="healthy-button" @click='submit' variant="primary">保存</b-button>
        </b-col>
        <b-col></b-col>
      </b-row>
</div>
</template>
<script>
import form from '../mock/reference'
export default {
  props: {
  },
  data () {
    return {
      form: form,
      isPass: false
    }
  },
  methods: {
    submit () {
      this.$store.dispatch('saveHealthyForm', this.form).then((res) => {
        return res
      })
    }
  }
}

</script>
<style scoped>
.healthy-form{
  background: #fff;
  padding: 20px;
}
.healthy-row{
  padding: 5px;
  text-align: right;
}
.healthy-col{
  text-align: left;
}
.healthy-button{
  margin-top: 10px;
  width: 200px
}
</style>
